前端js通过图片路径，展示图片

场景：图片文件存储在项目的一个文件夹里，数据库存储着图片的路径。前端需要获取到图片的路径并展示。

前端：通过获取的路径，拼接图片的src。

//域名
var host="http://"+window.location.host;
function editChat(contactWayId) {
    $.post( "/contactWay/getContactChatById", {"contactWayId": contactWayId}, function (r) {
        if(r.code==200){
            var d=r.data;
            var html="";
            for (var i=0;i<d.length;i++){
                //此处拼接src的地址
                var chatQrimgUrl=host+"/contactWay/getImage?filePath="+d[i].chatQrimgUrl;  

                //组织html代码。展示到界面            
                 html+=" <tr data-index=\"0\">\n" +
                    "                                                        <td style=\"text-align: center; \">\n" +
                    "                                                            <a href=\"http://\" target=\"_blank\">"+chatName+"</a>\n" +
                    "                                                        </td>\n" +
                    "                                                        <td style=\"text-align: center; \">\n" +
                    "                                                            <img style=\"width:120px;height:120px\" src="+chatQrimgUrl+">\n" +
                    "                                                        </td>\n" +
                    "                                                    </tr>";
            }
            $("#addtr").append(html);
        }
    })
}

后端：

 @RequestMapping("/contactWay/getImage")
    @ResponseBody
    public void getImagesId(HttpServletResponse hsp,String filePath) {
        File imageFile = new File(filePath);
        if (imageFile.exists()) {
            FileInputStream fis = null;
            OutputStream os = null;
            try {
                fis = new FileInputStream(imageFile);
                os = hsp.getOutputStream();
                int count = 0;
                byte[] buffer = new byte[1024 * 8];
                while ((count = fis.read(buffer)) != -1) {
                    os.write(buffer, 0, count);
                    os.flush();
                }

            } catch (Exception e) {
                e.printStackTrace();
            } finally {
                try {
                    fis.close();
                    os.close();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }

        }
    }